<template>
	  <view class="template-group">
 
	 <view class="listbox1 tn-flex tn-flex-col-center tn-flex-row-between tn-flex-wrap">
	 				<block v-for="(item,index) in list" :key="index" >
	 					<view class="listitem" @click="navigateToFn({ url: '/circleMixinPages/blogger_other?id='+item.id, checkLogin: false })">
	 						<view class="avatar">
	 							<image class="img20" :src="item.avatar" mode="aspectFill"></image>
	 						</view>
	 						<view class="txtbox tn-flex tn-flex-col-top tn-flex-row-between tn-flex-direction-column">
								
								<view class=" tn-flex  tn-flex-row-between">
									<view class="label tn-flex">
										<text class="txt tn-text-bold tn-text-sm tn-color-white">{{item.city}}</text>
										<text class="num tn-text-xs tn-margin-left-xs tn-color-white"></text>
									</view>
									<view class="label_r" style="position: absolute;right:0rpx" :class="[item.sex ==1?'label-male':'label-nv']"> 
									<view class="tags tn-color-white tn-flex tn-flex-col-center">
										<view class="tag tn-flex tn-flex-col-center tn-text-sm">
											<view :class="['icons',item.sex == 1?'tn-icon-sex-female':'tn-icon-sex-male']"></view>
											<view class="txt" v-if="item.sex==2||item.sex==0">女</view>
											<view class="txt" v-if="item.sex==1">男</view>
											
										</view>
										
									</view>
									</view>
								</view>
								
								
								
	 							<view class="bottom tn-padding-sm" style="    background: linear-gradient(to top, rgb(0 0 0 / 86%), rgb(255 255 255 / 0%));border-radius: 10px;">
	 
	 									<view class="name tn-color-white">{{item.nickname}}</view>
	 									<view class="botbox tn-flex tn-flex-col-center tn-flex-row-between tn-text-xs">
	 										<view class="tags tn-color-white tn-flex tn-flex-col-center">
	 											<view :class="['tag' , 'tn-flex', 'tn-flex-col-center',item.sex == 1?'tag-male label-male':'label-nv']">
	 											
	 												<view class="txt">{{item.shengri.age}}
													<text v-if="item.shengao"> {{item.shengao}}cm</text>
													</view>
	 											</view>
	 											<view class="tag tagbg tn-flex tn-flex-col-center">
	 												<view class="icons tn-icon-trusty-fill"></view>
	 												<view class="txt">{{item.shengri.constellation}}</view>
	 											</view>
	 										</view>
	 									
	 										<!-- <view class="tag tn-flex tn-flex-col-center tn-color-green--disabled">
	 											<view class="icons tn-icon-all"></view>
	 											<view class="txt tn-margin-left-xs">{{item.online}}</view>
	 										</view> -->
	 									</view>
	 							
	 							</view>
	 						</view>
	 					</view>
	 				</block>
	 
	 </view>		

	</view>
</template>

<script>
	const audioContext = uni.createInnerAudioContext()

	export default {
		props: ['list', 'type'],
	
		data() {
			return {
				noClick: true,
				videoPlay: false,
				isplay: false,
				body:''
			}
		},
		created() {
		
		},
		methods: {

			screenChange(e) {
				let _this = this;
				let fullScreen = e.detail.fullScreen;
				if (!fullScreen) {
					//_this.videoContext.pause();
					//_this.videoPlay = false;
				}
			},
			videoShow(vod) {
				uni.navigateTo({
					url: '/homeMixinPages/vodplay?vodurl=' + vod
				})
			},



			dakai(id) {
				if (this.isplay) {
					audioContext.stop()
					this.isplay = false
					return
				}
				uni.navigateTo({
					url: '/circleMixinPages/details?id=' + id
				});
			},

			shipin(vod) {
				this.videoPlay = true
				//this.$emit('bofang', vod)
			},

			chaozuo(item) {
				let that = this
				if (!uni.getStorageSync('token')) {
					that.msg('请登陆')
				}
				let list = []
				if (item.ziji == 1 && uni.getStorageSync('token')) {
					list = ['删除帖子'];
				}
				if (item.manage == 1) {
					list = ['删除帖子', '推荐贴子', '置顶帖子'];
				}
				uni.showActionSheet({
					itemList: list,
					success: function(res) {
						if (res.tapIndex == 0) {
							that.edieGoods(item.id, 1)
						}
						if (res.tapIndex == 1) {
							that.edieGoods(item.id, 2)
						}

						if (res.tapIndex == 2) {
							that.edieGoods(item.id, 3)
						}


					},
					fail: function(res) {
						console.log(res.errMsg);
					}
				});


			},

			async edieGoods(id, type) {
				console.log(3)
				let that = this;
				let result = await that.$request({
					loading: 1,
					method: 'post',
					url: '/chat/user/edieGoods',
					data: {
						id: id,
						type: type
					}
				});
				if (result.statusCode == 200) {
					if (result.data.code == 200) {
						that.msg(result.data.msg)

						if (type == 1) {
							const shaya = {
								id: id,
								msg: '删除'
							}
							uni.$emit('onlist_change', shaya)
						}



					} else {
						uni.showToast({
							icon: 'none',
							title: result.data.msg
						});

					}
				} else {
					uni.showToast({
						icon: 'none',
						title: that.$errorMsg
					});
				}


			},



			selectAddressFn(body) {
				if (body.lng) {
					uni.openLocation({
						longitude: Number(body.lng),
						latitude: Number(body.lat),
						name: '发布位置',
						address: body.address
					})
				} else {
					this.msg('未标注地图')
				}
			},



			dianzantiezi(item) {
				
				
				let that = this;
				if (that.noClick) {
				    // 第一次点击
				    that.noClick= false;	
					console.log('点击',that.noClick)
				     that.dianzantiezi_pass(item);				  
				    setTimeout(()=> {
				        that.noClick= true;
				    }, 2000)
				} else {
					console.log('重复',that.noClick)
				    // 这里是重复点击的判断
				}
				
				
				
				
			},

			tiezi(){
				console.log(333)
			},

			async dianzantiezi_pass(item) {
				if (!this.isLogin) {
					this.loginBoxFlag = true
					return false;
				}
				let result = await this.flowgoods(item.id)

				const shaya = {
					id: item.id,
					msg: result.msg
				}

				uni.$emit('onlist_change', shaya)
				this.msg(result.msg)
			},


	bofang(vocurl, index) {
	
		if (this.list[index].isplay) {
			audioContext.stop()
			this.list[index].isplay = false
			return
		}
	
	
		for (let i in this.list) {
			this.list[i].isplay = false
		}
	
		this.list[index].isplay = !this.list[index].isplay;
	
		let that = this
		audioContext.src = vocurl
		audioContext.play()
		audioContext.onPlay(() => {})
		audioContext.onEnded(() => {
			this.list[index].isplay = false
		})
		audioContext.onError(() => {
			this.list[index].isplay = false
			that.msg('不支持播放该音频格式')
		})
	},



		}
	};
</script>


<style scoped lang="scss">

		
		.listbox1{
			margin: 20rpx;
			.listitem{		
				width: 340upx;
				height: 500upx;
				position: relative;
				border-radius: 20upx;
				margin-bottom: 20upx;
				.avatar{
					width: 100%;
					height: 100%;
				}
				.txtbox{
					position: absolute;
					top: 0;
					width: 100%;
					height: 100%;
					.label{
						padding: 4upx 20upx;
						padding-bottom: 6upx;
						background: linear-gradient(to right, #7c00ff, #7c04ff);
						border-top-left-radius: 20upx;
						border-bottom-right-radius: 20upx;
					}
					.label_r{
						padding: 4upx 20upx;
						padding-bottom: 6upx;
						background: linear-gradient(to right,#7a4adc,#f34dc7);
						border-top-right-radius: 20upx;
						border-bottom-left-radius: 20upx;
					}
					
					
					.label-male{
						background: linear-gradient(to right,#56c2f4,#4ef3d2);
					}
					.bottom{
						width: 100%;
						.botbox{
							margin-top: 10upx;
						}
						.tags{
							
							.tag{
								background: #f34dc7;
								border-radius: 10upx;
								padding: 4upx 10upx;
								margin-right: 10upx;
							}
							.tagbg{
								background: #907af1;
							}
							.tag-male{
								background: #56c2f4;
							}
						}
					}
				}
			}
		}
		.img0{
			width: 100%;
			height: 100%;
		}
		.img20{
			width: 100%;
			height: 100%;
			border-radius: 20upx;
		}
		.img100{
			width: 100%;
			height: 100%;
			border-radius: 100upx;
		}
  
</style>
